<!DOCTYPE html>
<html>
<meta charset="utf-8">
<head th:include="include :: header"></head>
<body class="gray-bg">
	<div class="wrapper wrapper-content ">
		<div class="row">
			<div class="col-sm-12">
				<div class="ibox float-e-margins">
					<div class="ibox-content">
						<form class="form-horizontal m-t" id="signupForm">
						<input id="id" name="id" th:value="${publish.id}"  type="hidden">
												
							<div class="form-group">
								<label class="col-sm-3 control-label">标题：</label>
								<div class="col-sm-8">
									<input id="title" name="title" th:value="${publish.title}" class="form-control" type="text">
								</div>
							</div>
							<div class="form-group">
								<label class="col-sm-3 control-label">部门：</label>
								<div class="col-sm-8">
									<input id="createDeptName" name="createDeptName" th:value="${publish.createDeptName}" class="form-control" readonly="readonly" type="text">
								</div>
							</div>
							<div class="form-group">
								<label class="col-sm-3 control-label">发布人：</label>
								<div class="col-sm-8">
									<input id="createName" name="createName" th:value="${publish.createName}" class="form-control"  readonly="readonly"type="text">
								</div>
							</div>
							<div class="form-group">
								<label class="col-sm-3 control-label">首页显示：</label>
								<div class="col-sm-8">
									<label class="radio-inline" th:each="dict:${yesNoList}">
										<input  th:field="*{publish.showIndex}" type="radio" name="showIndex" th:value="${dict.id}" th:text="${dict.name}"/>
									</label>
								</div>
							</div>
							<div class="form-group">
								<label class="col-sm-3 control-label">类型：</label>
								<div class="col-sm-8">
									<label class="radio-inline" th:each="dict:${dictList}">
										<input  th:field="*{publish.type}" type="radio" name="type" th:value="${dict.id}" th:text="${dict.name}"/>
									</label>
								</div>
							</div>
							<div class="form-group">
								<label class="col-sm-3 control-label">创建时间：</label>
								<div class="col-sm-8">
									<input id="createDate" disabled name="createDate" th:value="${#dates.format(publish.createDate,'yyyy-MM-dd HH:mm:ss')}" class="form-control" type="text">
								</div>
							</div>
							<!--<style>
								#btnUpload{
									margin-top: 4px;
								}
								.layui-upload-file {
									display: none!important;
									opacity: .01;
									filter: Alpha(opacity=1);
								}
							</style>-->
							<div class="form-group layui-upload">
								<label class="col-sm-3 control-label">附件上传：</label>
								<div class="col-sm-8">
									<!--<button type="button" class="btn btn-success" id="btnUpload"><i class="fa fa-cloud"></i> 选择文件</button>-->
									<div class="layui-upload-lis">
										<table class="layui-table">
											<thead>
											<tr>
												<th>文件名</th>
												<th>大小</th>
												<th>状态</th>
												<th style="width:180px;">操作</th>
											</tr>
											</thead>
											<tbody id="demoList" th:each="hnzkFiles:${hnzkFiles}"  >
												<tr>
													<td th:text="${hnzkFiles.fileName}"></td>
													<td th:text="${(hnzkFiles.fileSize/1024.0/1024.0)<1 ? #numbers.formatDecimal(hnzkFiles.fileSize/1024.0,0,2)+'KB' : #numbers.formatDecimal(hnzkFiles.fileSize/1024.0/1024.0,0,2)+'MB'}">大小</td>
													<td >已上传</td>
													<td>
														<button type="button" class="btn btn-xs btn btn-danger" onclick="deleteFile(this);" th:id="${hnzkFiles.id}">删除</button>
														<button type="button" class="btn btn-xs btn btn-primary " onclick="download(this);" th:id="${hnzkFiles.id}">下载</button>
													</td>
												</tr>
											</tbody>

										</table>
									</div>
									<!--<button type="button" class="btn  btn-primary" id="testListAction">开始上传</button>-->
									<input id="affixId" name="affixId" class="form-control" type="hidden" th:value="${publish.affixId}">
								</div>
							</div>
							<div class="form-group">
								<label class="col-sm-3 control-label">内容：</label>
								<div class="col-sm-8">
									<textarea id="content" name="content" th:text="${publish.content}" class="form-control summernote" rows="5"></textarea>
								</div>
							</div>

							<div class="form-group">
								<label class="col-sm-3 control-label">审批意见：</label>
								<div class="col-sm-8">
									<textarea id="approvalMessage" name="approvalMessage" th:text="${publish.approvalMessage}" class="form-control" rows="3"></textarea>
								</div>
							</div>
							<div class="form-group">
								<div class="col-sm-8 col-sm-offset-3">
									<button type="submit" class="btn btn-primary">提交</button>
									<button type="button" class="btn closeBtn" onclick="myClose();">关闭</button>
								</div>
							</div>
						</form>
					</div>
				</div>
			</div>
	</div>
	</div>
	<div th:include="include::footer"></div>
	<script type="text/javascript" src="/js/appjs/hnzk/publish/edit.js">
	</script>
	<script src="/js/layui.js"></script>
	<script type="text/javascript">
		function deleteFile(e) {
			var fid = $(e).attr("id");
			console.info("fid:"+fid);
			$.ajax({
				url : "/hnzk/file/removeFile",
				type : "post",
				data : {
					'id' : fid
				},
				success : function(r) {
					if (r.code==0) {
						layer.msg(r.msg);
						$(e).parent().parent().remove();
					}else{
						layer.msg(r.msg);
					}
				}

			})
		}


		function download(e) {
			var fid = $(e).attr("id")
			window.open("/hnzk/file/download?id="+fid);

		}

		function myClose(){
			var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
			parent.layer.close(index); //再执行关闭

		}

		$(document).ready(function() {
			$('.summernote').summernote({
				lang: 'zh-CN',
				height: 300,
				//tabsize: 3,
				toolbar: [
					// [groupName, [list of button]]
					['style', ['bold', 'italic', 'underline', 'clear']],
					['font', ['strikethrough', 'superscript', 'subscript']],
					['fontsize', ['fontsize']],
					['color', ['color']],
					['insert', ['link', 'picture', 'table']],
					['view', ['fullscreen', 'codeview', 'help']],
					['para', ['ul', 'ol', 'paragraph']],
					['height', ['height']]

				],
				lang: 'zh-CN',
				callbacks:{
					onImageUpload: function (files) {
						//上传图片到服务器
						var files_length = files.length;
						//此处循环上传每一个图片
						for(var i=0;i<files_length;i++){
							sendFile(files[i]);
						}

					},
					onMediaDelete: function (target) {
						//var imgSrc = target[0].currentSrc;
						//console.info(imgSrc);
						//console.info(target);
						var fileId = target[0].dataset.filename;
						console.info(fileId);
						var data = new FormData();
						data.append("fileId", fileId);
						$.ajax({
							data: data,
							type: "POST",
							url: "/hnzk/file/deleteImg",
							cache: false,
							contentType: false,
							processData: false,
							dataType : "json",
							success: function (data) {
								console.log(data);
								if(data.code == 0){
									//alert("")
									layer.open({
										content: '移除图片成功' //这里content是一个普通的String
									});
								}
							}
						});
						//alert("移除图片")
					}
				}

			});
		});
		//上传图片
		function sendFile(file){
			var formdata = new FormData();
			var fileName = file['name'];
			formdata.append("file", file);
			$.ajax({
				//图片上传出来的url，返回的是图片上传后的路径，http格式
				url : "/hnzk/file/add",
				type : "POST",
				data : formdata,
				cache : false,
				contentType : false,
				processData : false,
				dataType : "json",
				success: function(result) {
					//url:图片路径 filename：图片名称
					$('.summernote').summernote('insertImage', result.data.path,result.data.fileid);
				},
				error:function(){
					layer.open({
						content: '上传失败' //这里content是一个普通的String
					});
				}
			});
		}
		var demoListView = $('#demoList')
		var affixId = $("#affixId").val();
		//上传按钮实例化
		layui.use('upload', function () {
			var upload = layui.upload;
			//执行实例
			var uploadInst = upload.render({
				elem: '#btnUpload' //绑定元素
				,url: '/hnzk/file/uploadFile/'
				,accept: 'file'
				,multiple: true
				,auto: false
				,bindAction: '#testListAction'
				,data:{ "affixId":affixId }
				,choose: function(obj){
					var files = this.files = obj.pushFile(); //将每次选择的文件追加到文件队列
					//读取本地文件
					obj.preview(function(index, file, result){
						var tr = $(['<tr id="upload-'+ index +'" >'
							,'<td>'+ file.name +'</td>'
							,'<td>'+ (file.size/1014).toFixed(1) +'kb</td>'
							,'<td>等待上传</td>'
							,'<td>'
							,'<button class="btn btn-xs btn-primary demo-reload layui-hide" style="margin-right: 6px;">重传</button>'
							,'<button class="btn btn-xs btn btn-danger demo-delete">删除</button>'
							,'</td>'
							,'</tr>'].join(''));

						//单个重传
						tr.find('.demo-reload').on('click', function(){
							obj.upload(index, file);
						});

						//删除
						tr.find('.demo-delete').on('click', function(){
							delete files[index]; //删除对应的文件
							tr.remove();
							uploadInst.config.elem.next()[0].value = ''; //清空 input file 值，以免删除后出现同名文件不可选
						});

						demoListView.append(tr);
					});
				}
				,done: function(res, index, upload){
					console.info(res)
					if(res.code == 0){ //上传成功
						var tr = demoListView.find('tr#upload-'+ index)
								,tds = tr.children();
						tds.eq(2).html('<span style="color: #5FB878;">上传成功</span>');
						tds.eq(3).html(''); //清空操作
						return delete this.files[index]; //删除文件队列已经上传成功的文件
					}
					this.error(index, upload);
				}
				,error: function(index, upload){
					var tr = demoListView.find('tr#upload-'+ index)
							,tds = tr.children();
					tds.eq(2).html('<span style="color: #FF5722;">上传失败</span>');
					tds.eq(3).find('.demo-reload').removeClass('layui-hide'); //显示重传
				}
			});
		});
	</script>
</body>
</html>
